<script setup lang="ts">
import medicine from './components/medicine.vue'
import { onMounted } from 'vue'
import type { TabsPaneContext } from 'element-plus'
defineOptions({
  name: 'Homebottom',
})
const activeName = ref('XCY')
const handleClick = (tab: TabsPaneContext, event: Event) => {
  console.log(tab, event)
}
onMounted(() => {})
</script>

<template>
  <div id="Homebottom">
    <el-tabs v-model="activeName" type="border-card" @tab-click="handleClick">
      <el-tab-pane name="MZYZ" label="门诊医嘱">门诊医嘱</el-tab-pane>
      <el-tab-pane name="XCY" label="西成药"><medicine></medicine></el-tab-pane>
      <el-tab-pane name="ZCY" label="中草药">中草药</el-tab-pane>
      <!-- 互联网医院————不需要 -->
      <!-- <el-tab-pane name="JY" label="检验">检验</el-tab-pane> -->
      <!-- <el-tab-pane name="JC" label="检查">检查</el-tab-pane> -->
      <el-tab-pane name="QTYZ" label="其他医嘱">其他医嘱</el-tab-pane>
    </el-tabs>
  </div>
</template>

<style lang="scss" scoped>
#Homebottom {
  width: 100%;
  height: 100%;
  background-color: #fff;
  :deep(.el-tabs__item) {
    width: 180px !important;
  }
  :deep(.el-tabs) {
    height: 99%;
  }
}
</style>
